<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ include file="../header.jsp" %>
<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
	.main_div{
		margin : 15px;
	}
</style>
</head>
<body>
<div class="main_div">
	<form id="form_insert" onsubmit="return false" class="layui-form layui-form-pane" action="">
		<div class="layui-form-item">
			<label class="layui-form-label">用户名</label>
			<div class="layui-input-block">
				<input path="name" type="text" name="name" autocomplete="off" placeholder="请输入标题" class="layui-input"/>
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">密码</label>
			<div class="layui-input-block">
				<input type="text" name="password" lay-verify="required" placeholder="请输入" autocomplete="off"
					   class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">真实姓名</label>
			<div class="layui-input-block">
				<input type="text" name="trueName" lay-verify="required" placeholder="请输入" autocomplete="off"
					   class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">邮箱</label>
			<div class="layui-input-block">
				<input type="text" name="email" lay-verify="required" placeholder="请输入" autocomplete="off"
					   class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">电话</label>
			<div class="layui-input-block">
				<input type="text" name="phone" lay-verify="required" placeholder="请输入" autocomplete="off"
					   class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">角色</label>
			<div class="layui-input-block" id="roles" name="roles">
			</div>
			<input type="button" class="layui-btn" onclick="submitForm()" value="提交"/>
		</div>
	</form>


	<script>
		layui.config({
			base : '/static/'
		}).extend({
			selectM: './layui_extends/selectM'
		}).use(['form', 'selectM'], function () {
			var form = layui.form;
			var selectM = layui.selectM;

			$.ajax({
				url: '/role/selectAllRoles',
				type: 'POST',
				dataType: 'json',
				success: function (jsonResult) {
					if (jsonResult.ok) {
						//多选标签-基本配置
						var tagIns = selectM({
							//元素容器【必填】
							elem: '#roles'
							//候选数据【必填】
							, data: jsonResult.data // List<LayUISelectMVO>
							//默认值
							/* ,selected: [1,2] */
							// 默认最多选中5个
							, max: 100
						});
					}
				}
			});
		});

		//ajax方式提交form表单
		function submitForm() {
			// 使用正则表达式验证表单数据是否合法
			// 用户名 6-10字母数字
			// 邮箱：要符合邮箱的格式

			$.ajax({
				url: '/user/insert',
				data: $('#form_insert').serialize(),
				type: 'POST',
				dataType: 'json',
				success: function (jsonResult) {
					if (jsonResult.ok) {
						mylayer.okUrl(jsonResult.msg, '/user/getUserListPage');
					} else {
						mylayer.errorMsg(jsonResult.msg);
					}
				}
			});
		}

	</script>
</div>
</body>
</html>